<template>
	<view class="p-2 bg-light content">
		<!-- 买方需求商品详情 -->
		<view class="bg-white my-2 p-2 cont">
			<text class="h3 font-weight-bold">订单信息</text>
			<view class="title1">
				<view class="flex justify-between">
					<text>商品名称:</text>
					<text>{{ FormData.Data.Article_Name }}</text>
				</view>
				<view class="flex justify-between">
					<text>商品价格:</text>
					<text class="text-danger">￥{{ FormData.Data.Amount }}</text>
				</view>
				<view class="flex justify-between">
					<text>需求总量:</text>
					<text>{{ FormData.Data.Total_Quantity }}{{ FormData.Data.Unit }}</text>
				</view>
				<view class="flex justify-between">
					<text>最低买入数量:</text>
					<text>{{ FormData.Data.Starting_Quantity }}{{ FormData.Data.Unit }}</text>
				</view>
			</view>
			<view class="w-100 title1">
				<view class="flex justify-between">
					<text>挂单标题:</text>
					<text>{{ FormData.Data.Group_Seek_Purchase_Name }}</text>
				</view>
				<view class="flex justify-between">
					<text>保证方式:</text>
					<text>{{
            FormData.Data.Guarantee_Method == "0" ? "保证金" : "非保证金"
          }}</text>
				</view>
				<view class="flex justify-between">
					<text>付款周期:</text>
					<text>{{
            FormData.Data.Trading_Type == "0" ? "全额" : "按阶段付款"
          }}</text>
				</view>
				<view class="flex justify-between">
					<text>截止时间:</text>
					<text>{{ FormData.Data.Delivery_Time }}</text>
				</view>
				<view class="flex justify-between">
					<text>买方企业:</text>
					<text class="I">{{ FormData.Data.Enterprise_Name }}</text>
				</view>
				<view class="flex justify-between">
					<text>买方姓名:</text>
					<text class="">{{ FormData.Data.Contacts }}</text>
				</view>
				<view class="flex justify-between">
					<text>买方手机号:</text>
					<text class="">{{ FormData.Data.Contacts_Phone }}</text>
				</view>
			</view>
		</view>
		<!-- 卖方信息 -->
		<view class="bg-white my-2 p-2 cont">
			<text class="h3 font-weight-bold">确认收货地址</text>
			<view class="p-2">
				<uni-forms :rules="rules" :modelValue="form" ref="formData">
					<uni-forms-item label-width="100" name="Seller_Contact" label="发货人:">
						<uni-easyinput v-model.trim="form.Seller_Contact" type="text" placeholder="请输入发货人" />
					</uni-forms-item>
					<uni-forms-item label-width="100" name="Seller_Contact_Phone" label="手机号:">
						<uni-easyinput v-model.trim="form.Seller_Contact_Phone" type="text" placeholder="请输入手机号" />
					</uni-forms-item>
					<uni-forms-item label-width="100" name="Seller_Contact_Phone" label="地址:">
						<uni-data-picker v-if="Address.length!=0" @change="AddressChange" placeholder="请选择地址"
							popup-title="请选择所在地区" :localdata="Address" v-model="address">
						</uni-data-picker>
					</uni-forms-item>
					<uni-forms-item label-width="100" name="Seller_Contact_Phone" label="详情地址:">
						<uni-easyinput v-model.trim="form.Seller_Contact_Address" type="text" placeholder="请输入详情地址" />
					</uni-forms-item>
					<uni-forms-item style="margin-bottom: 0" label-width="100" name="Reservation_Time" label="预约时间:">
						<uni-datetime-picker placeholder="请选择预约时间" v-model="form.Reservation_Time" />
					</uni-forms-item>
				</uni-forms>
			</view>
		</view>
		<!-- 交收方式 -->
		<view class="bg-white my-2 p-2 cont">
			<text class="h3 font-weight-bold">交收方式</text>
			<view class="font-sm p-2 title2">
				<view class="II">
					<text class="mr-2">装运方式:</text>
					<uni-data-select v-if="FormData.Shipment.length!=0" placeholder="请选择装运方式"
						v-model="form.Shipment_SerialNumber" :localdata="FormData.Shipment"></uni-data-select>
				</view>
				<view class="II">
					<text class="mr-2">运输方式:</text>
					<uni-data-select v-if="FormData.Transport.length!=0" placeholder="请选择运输方式"
						v-model="form.Transport_SerialNumber" :localdata="FormData.Transport"></uni-data-select>
				</view>
				<view class="II">
					<text class="mr-2">付款方式:</text>
					<uni-data-select v-if="FormData.Payment.length!=0" placeholder="请选择付款方式"
						v-model="form.Payment_SerialNumber" :localdata="FormData.Payment"></uni-data-select>
				</view>
			</view>
		</view>
		<!-- 付款周期细则 -->
		<view class="bg-white my-2 p-2 cont">
			<text class="h3 font-weight-bold">付款周期细则</text>
			<view class="">
				<view class="flex flex-column">
					<view v-for="(item, i) in FormData.Paystages" :key="i" class="flex flex-column m-1 p-1 font-md"
						style="justify-content: space-evenly">
						<view class="flex align-center mt-1">
							<text>{{ item.Trading_Explain }}</text>
						</view>
						<view class="flex align-center mt-1">
							<text>按条件付款额度(%):</text>
							<text class="text-danger">{{ item.Trading_Amount }}%</text>
						</view>
						<view class="flex align-center mt-1">
							<text>最晚按条件付款时间:</text>
							<text class="text-success">{{ item.Trading_Detail_Name }}</text>
							<text class="text-success">{{ item.Trading_Date }}天</text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 发货量 -->
		<view class="bg-white my-2 p-2 cont">
			<text class="h3 font-weight-bold">发货量</text>
			<view class="left">
				<uni-number-box :value="min" v-model="form.Quantity" :min="min" :max="max" :step="num" />
			</view>
			<view class="right">
				<button :loading="loading" class="uni-button" type="primary" @click="handleSubmit">提交</button>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getGroupSeekProcureIDAction,
		GroupSeekCheckStockAction,
		setGroupSeekTransactionAction
	} from '@/api/group.js'
	import {
		getAddAction
	} from '@/api/global.js'
	import Tradingchat from "@/components/Tradingchat2/Tradingchat.vue";
	import times from "@/mixins/time.js";
	const app = getApp();
	const {
		Address
	} = data222();
	import {
		data222
	} from "@/static/js/data.js";
	export default {
		onLoad(e) {
			this.form.Seller_Contact = uni.getStorageSync("username");
			this.form.Seller_Contact_Phone = uni.getStorageSync("use");
			let data = {
				Group_Seek_Purchase_SerialNumber: e.Group_Seek_Purchase_SerialNumber,
				token: uni.getStorageSync('token'),
			}
			this.getGroupSeekProcureID(data)
			let token = uni.getStorageSync("token");
			this.Enterprise_Info_SerialNumber = uni.getStorageSync("enterprise");
			let pages = getCurrentPages();
			this.LoginUrl = pages[pages.length - 1].$page.fullPath;
			if (token == "") {
				uni.showModal({
					title: "登录已失活",
					content: "系统检测到您未登录或登录超时",
					cancelText: "暂不登录",
					confirmText: "去登陆",
					success(res) {
						if (res.cancel) {
							uni.switchTab({
								url: "/pages/index/index",
							});
						}
						if (res.confirm) {
							uni.navigateTo({
								url: "/pages/My/Login?LoginUrl=" + this.LoginUrl,
							});
						}
					},
				});
			}
		},
		components: {
			Tradingchat,
		},
		data() {
			return {
				LoginUrl: "",
				disabled: false,
				Paystages: [{
					Trading_Detail_Name: "",
				}, ],
				num: 0,
				min: 0,
				max: 1,
				Quantity: 0,
				Enterprise_Info_SerialNumber: "",
				FormData: {
					Data: {
						Enterprise_Name: ''
					},
					Payment: [],
					Shipment: [],
					Transport: []
				},
				form: {
					Group_Seek_Transaction_SerialNumber: "", //主键
					Group_Seek_Purchase_SerialNumber: "", //流水号
					Quantity: "", //总量
					Amount: "", //钱
					Submission_Time: "", //时间
					Shipment_SerialNumber: "",
					Transport_SerialNumber: "",
					Payment_SerialNumber: "",
					Reservation_Time: "",
					Seller_Contact: "", //买主姓名
					Seller_Contact_Phone: "", //买主手机号
					Seller_Contact_Address: "", //买家地址
					Seller_Enterprise_Info_SerialNumber: "", //买主公司编号
					Enterprise_Info_SerialNumber: "", //卖家公司编号
					Children: {
						group_seek_transaction_paystages: [{
							Group_Seek_Paystages_SerialNumber: "",
							Group_Seek_Transaction_SerialNumber: "",
							Trading_Name: "",
							Trading_Amount: "",
							Trading_Date: "",
							Amount: "",
							Collection_Amount: ""
						}]
					}
				},
				rules: {
					// 对Seller_Contact字段进行必填验证
					Seller_Contact: {
						rules: [{
								required: true,
								errorMessage: "请输入卖方姓名",
							},
							{
								minLength: 1,
								maxLength: 5,
								errorMessage: "姓名长度在 {minLength} 到 {maxLength} 个字符",
							},
						],
					},
					//对Seller_Contact_Phone字段进行必填验证
					Seller_Contact_Phone: {
						rules: [{
								required: true,
								errorMessage: "请输入卖方手机号",
							},
							// {
							// 	pattern: /^1[3-9]\d{9}$/,
							// 	errorMessage: '手机号不合法！'
							// }
						],
					},
					Reservation_Time: {
						rules: [{
							required: true,
							errorMessage: "请选择预约时间",
						}, ],
					},
				},
				//测试
				Address: Address(),
				address: [],
				addressDetail: '',
				loading:false,
			};
		},
		methods: {
			AddressChange(e) {
				this.addressDetail = e.detail.value[0].text + '/' + e.detail.value[1].text + '/' + e.detail.value[2].text +
					'/'
			},
			async getGroupSeekProcureID(data) {
				const res = await getGroupSeekProcureIDAction({
					data,
				})
				if (res.redirect && res.redirect == 'REDIRECT') {
					setTimeout(function() {
						uni.navigateTo({
							url: "/pages/My/Login"
						});
					}, 2000);
				} else if (res.Status == 'success') {
					this.FormData = res
					console.log(this.FormData)
					this.num = Number(res.Data.Starting_Quantity);
					this.min = Number(res.Data.Starting_Quantity);
					this.max = Number(res.Data.Total_Quantity);
					this.FormData.Payment.forEach(item => {
						item.text = item.Payment_Name
						item.value = item.Group_Seek_Purchase_Payment_SerialNumber
					})
					this.FormData.Shipment.forEach(item => {
						item.text = item.Shipment_Name
						item.value = item.Group_Seek_Purchase_Shipment_SerialNumber
					})
					this.FormData.Transport.forEach(item => {
						item.text = item.Transport_Name
						item.value = item.Group_Seek_Purchase_Transport_SerialNumber
					})
				}
			},
			handleSubmit() {
				if (this.form.Quantity == 0) {
					uni.showToast({
						title: "请先添加购买数量",
						icon: "none",
					});
					return;
				}
				if (this.form.Shipment_SerialNumber == "") {
					uni.showToast({
						title: "请选择装运方式",
						icon: "none",
					});
					return;
				}
				if (this.form.Transport_SerialNumber == "") {
					uni.showToast({
						title: "请选择运输方式",
						icon: "none",
					});
					return;
				}
				if (this.form.Payment_SerialNumber == "") {
					uni.showToast({
						title: "请选择付款方式",
						icon: "none",
					});
					return;
				}
				this.$refs.formData.validate().then((res) => {
						const _this = this;
						if (!_this.loading) {
							this.loading = true
							uni.showModal({
								title: "平台通知",
								content: "平台会收取交易双方各1%交易额度的手续费",
								cancelText: "我再想想",
								success(res) {
									if (res.confirm) {
										uni.showLoading({
											title: "提交中...",
										});
										let data = {
											Group_Seek_Purchase_SerialNumber: _this.FormData.Data
												.Group_Seek_Purchase_SerialNumber,
											Quantity: _this.form.Quantity,
											token: uni.getStorageSync('token')
										}
										_this.CheckSeekStock(data)
									}
								},
							});
						}
					}).catch((err) => {
						console.log(err)
						uni.showToast({
							title: '请检查页面表单',
							icon: 'none'
						})
					});
			},
			async CheckSeekStock(data) {
				const res = await GroupSeekCheckStockAction({
					data,
				})
				if (res.redirect && res.redirect == 'REDIRECT') {
					uni.navigateTo({
						url: "/pages/My/Login"
					});
				} else if (res.Status == 'success') {
					this.form.Submission_Time = times.nowtime()
					this.form.Enterprise_Info_SerialNumber = this.FormData.Data.Enterprise_Info_SerialNumber
					this.form.Group_Seek_Purchase_SerialNumber = this.FormData.Data.Group_Seek_Purchase_SerialNumber
					this.form.Amount = this.FormData.Data.Amount
					this.form.Seller_Enterprise_Info_SerialNumber = uni.getStorageSync('enterprise')
					if (this.FormData.Data.Trading_Name == '按阶段付款') {
						this.form.Children.group_seek_transaction_paystages = []
						this.FormData.Paystages.forEach(item => {
							this.form.Children.group_seek_transaction_paystages.push({
								Group_Seek_Paystages_SerialNumber: "",
								Group_Seek_Transaction_SerialNumber: "",
								Trading_Detail_SerialNumber: item.Trading_Detail_SerialNumber,
								Trading_Name: item.Trading_Detail_Name,
								Trading_Explain: item.Trading_Explain,
								Trading_Amount: item.Trading_Amount,
								Trading_Date: item.Trading_Date,
								Amount: item.Trading_Amount * this.form.Quantity * this.form.Amount /
									100,
								Collection_Date: "",
								Collection_Amount: 0
							})
						})
					} else {
						this.form.Children.group_seek_transaction_paystages = [{
							Group_Seek_Paystages_SerialNumber: "",
							Group_Seek_Transaction_SerialNumber: "",
							Trading_Detail_SerialNumber: this.FormData.Paystages[0]
								.Trading_Detail_SerialNumber,
							Trading_Name: this.FormData.Paystages[0].Trading_Detail_Name,
							Trading_Explain: this.FormData.Paystages[0].Trading_Explain,
							Trading_Amount: this.FormData.Paystages[0].Trading_Amount,
							Trading_Date: this.FormData.Paystages[0].Trading_Date,
							Amount: this.FormData.Paystages[0].Trading_Amount * this.form.Quantity * this.form
								.Amount / 100,
							Collection_Date: "",
							Collection_Amount: 0
						}]
					}
					let data = {
						Data: JSON.stringify({
							"group_seek_transaction": [this.form]
						}),
					}
					console.log(this.FormData)
					this.getAdd(data)
				} else {
					uni.hideLoading()
					uni.showToast({
						title:'失败',
						icon:'none'
					})
					this.loading = false
				}
			},
			async getAdd(data) {
				const res = await setGroupSeekTransactionAction({
					data,
				})
				if (res.redirect && res.redirect == 'REDIRECT') {
					Message({
						message: '登录超时,请重新登录',
						type: 'error'
					})
					setTimeout(function() {
						uni.navigateTo({
							url: "/pages/login/login"
						});
					}, 2000);
				} else if (res.Status == 'success') {
					console.log(res);
					let group_seek_message = {
						Group_Seek_Message_SerialNumbel: "",
						Group_Seek_Transaction_SerialNumber: res.Data,
						Cause: "提交成功",
						Submission_Time: times.nowtime(),
						Enterprise_Info_SerialNumber: uni.getStorageSync('enterprise'),
						Seller_Type: "0"
					}
					let qroup_seek_purchase = {
						Group_Seek_Message_SerialNumbel: "",
						Group_Seek_Transaction_SerialNumber: res.Data,
						Cause: "申请提示",
						Submission_Time: times.nowtime(),
						Enterprise_Info_SerialNumber: this.FormData.Data.Enterprise_Info_SerialNumber,
						Seller_Type: "1"
					}
					let group_message = []
					group_message.push(group_seek_message)
					group_message.push(qroup_seek_purchase)
					let data = {
						Data: JSON.stringify({
							"group_seek_message": group_message
						}),
						token: uni.getStorageSync('token'),
					}
					this.submitMessage(data)
				} else {
					uni.hideLoading()
					uni.showToast({
						title: '失败!',
						icon: 'none'
					})
					this.loading = false
				}
			},
			async submitMessage(data) {
				const res = await getAddAction({
					data,
				})
				if (res.redirect && res.redirect == 'REDIRECT') {
					setTimeout(function() {
						uni.navigateTo({
							url: "/pages/My/Login"
						});
					}, 2000);
				} else if (res.Status == 'success') {
					uni.hideLoading()
					this.loading = true
					uni.showToast({
						title: '提交成功!',
						icon: 'none'
					})
					uni.navigateBack()
				} else {
					uni.hideLoading()
					uni.showToast({
						title: '失败!',
						icon: 'none'
					})
					this.loading = false
				}
			},
			goTrad(type) {
				this.$refs.popup.open(type);
			},
		},
	};
</script>

<style lang="scss">
	.content {
		padding: 20rpx;
		box-sizing: border-box;

		.cont {
			border-radius: 20rpx;
			background-color: #fff;
			padding: 25rpx;
			box-sizing: border-box;
			margin: 0 0 30rpx 0;

			.title1 {
				font-size: 35rpx;
				padding: 20rpx;
				box-sizing: border-box;

				view {
					margin: 20rpx 0;
				}

				.I {
					width: 70%;
					display: inline-block;
					margin: 0 0 0 10rpx;
				}
			}

			.title2 {
				font-size: 35rpx;
				padding: 20rpx;
				box-sizing: border-box;

				view {
					margin: 20rpx 0;
					display: flex;
				}

				.II {
					display: flex;
					flex-direction: column;
				}
			}

			.fah {
				display: flex;
				height: 160rpx;
				flex-direction: column;
				justify-content: space-between;

				.right {
					display: flex;
					justify-content: space-between;

					.uni-button {
						margin: 0;
					}
				}
			}
		}
	}
</style>